<template>
  <view class="login">
    <view class="main">
      <view class="safe-tips">
        <image class="icon"  :src="dataInfo.share_img" mode="scaleToFill" />
      </view>
      <view class="title flex flex-center flex-align">{{ dataInfo.title }}</view>
      <view class="form">
        <button class="form-submit" @click="onSubmit">登录</button>
      </view>
    </view>
    <view class="footer">
      <view class="footer-agreement flex flex-align">
        <radio :checked="agree" style="transform: scale(.7);" @click="changeCheck" color="#FE7431"/>
        <view> 阅读并同意</view><view class="a">《用户协议》</view>和<view class="a">《隐私政策》</view>
      </view>
    </view>
  </view>
</template>

<script lang="ts" setup>
import { getURL } from '@/utils/tools';
import { ref } from 'vue';
import { useAuthStore } from '@/stores/counter'
const store=useAuthStore();
const agree = ref(true)
const redirectUrl = getURL(location.href,0)+'#/pages/login/login'  
const url = `https://open.weixin.qq.com/connect/oauth2/authorize?appid=wxb171640197e77eb6&redirect_uri=` + encodeURIComponent(redirectUrl) + `&response_type=code&scope=snsapi_userinfo&state=STATE&connect_redirect=1#wechat_redirect`;
// window.location.replace(url)
const dataInfo = store.confige.wechat
function onSubmit() {
  if(!agree.value){
    uni.showToast({
      title: '请先同意协议',
      icon: 'none'
    })
    return
  }
  window.location.replace(url)
}
function changeCheck(){
  agree.value = !agree.value
}
</script>

<style scoped lang="scss">
  .safe-tips {
    display: flex;
    padding-top: 15vh;
    justify-content: center;

    .icon {
      width: 200rpx;
      height: 200rpx;border-radius: 100%;
    }
  }
  .title{margin-top: 26rpx;font-size: 32rpx;color: #666;}
  .form {
    margin:20vh 100rpx 0;
    .form-submit {
      width: 100%;
      height: 80rpx;
      border-radius: 40rpx;font-size: 26rpx;background: #FE7431;color: #fff;text-align: center;line-height: 80rpx;
    }
  }
  .footer{margin: 30rpx 100rpx 0;
    .footer-agreement{font-size: 24rpx;color: #969799;
      checkbox{margin-right: 10rpx;}
      .a{color: #FE7431;}
    }
  }
</style>